<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><#assign path="${request.getContextPath()}">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="${path}/jquery/jquery-1.4.1.min.js" type="text/javascript"></script>
<link href="${path}/userCenter/css/validationEngine.jquery.css" type="text/css" rel="stylesheet"/>
<script src="${path}/jquery/jquery.blockUI.js" type="text/javascript"></script>
<script src="${path}/jquery/galleria.js" type="text/javascript"></script>
<script src="${path}/jquery/jquery.validationEngine-en.js" type="text/javascript"></script>
<script src="${path}/jquery/jquery.validationEngine.js" type="text/javascript"></script>
<link href="${path}/css/reset.css" type="text/css" rel="stylesheet"/>
<link href="${path}/css/frame.css" type="text/css" rel="stylesheet"/>
<link href="${path}/css/header.css" type="text/css" rel="stylesheet"/>
<link href="${path}/css/sidebar.css" type="text/css" rel="stylesheet"/>
<link href="${path}/css/footer.css" type="text/css" rel="stylesheet"/>
<link href="${path}/css/pager.css" type="text/css" rel="stylesheet"/>
<link  href="${path}/blogManager/albumManager/css/albumCreate.css" type="text/css" rel="stylesheet"/>
<script src="${path}/blogManager/albumManager/js/albumCreate.js" type="text/javascript"></script>
<title>Album Create</title>
<link rel="short cut icon" HREF="${path}/images/favicon.ico" />
<script >
	Galleria.loadTheme('${path}/jquery/galleria/themes/classic/galleria.classic.js');
</script>
</head>

<body>
<div id="wrapper">
	<#include "/header.ftl" />
	<div id="content">
		<div>
			<@s.form id="albumCreate" action='createAlbum' namespace='/blogManager' method='post' theme="simple" >
				<div>
					<b><@s.text name="album.title"/></b><input id="albumTitle" class="validate[required]" style="margin-left:10px;" type="text" name="albumTitle" value='' />
					<div id="albumPhotos">
						<b><@s.text name="album.photos"/>:</b>
						<ul class = "albumUL">
		      			   <li class="check"></li>
		                   <li class="titleLi">Photo Name</li>
		                   <li class='descLi'>Photo Description</li>
		                   <li class="editLi">Operation</li>
						</ul>
						
					
					</div>
					
				</div>
				<div id="galleriaPage">
					<div id="galleria">
					<#list pager.resultList as photo>
						
							<div>
					            <a href="${path}/${photo.url}" alt="Not found" >
					               <img src="${path}/${photo.url}" alt="Not found"  />
					            </a>
					            <span><b>Operator:</b><span  id="${photo.id}" onclick='addToAlbum(this)' class='addToAlbum' style="cursor:pointer;text-decoration:underline;margin-left:10px;color:#ffffff;font-style:normal"><@s.text name="album.addPhoto" /></span><input type='hidden' name='photoName' value='${photo.fileName}' /></span>
					            <span>Path: ${photo.url}</span>
					        </div>
							
					</#list>
					
					</div>
					<#assign action = "ajaxGalleria" />
					<#assign namespace = "/blogManager" />
					<#include "/pager.ftl" />
				</div>
				
				<@s.submit value='Create' />
			</@s.form>
		</div>
		
		
	</div>
	<#include "/blogManager/managerSidebar.ftl" />
	<#include "/blogManager/managerFooter.ftl" />
</div>	
</body>

</html>